<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>查看及编辑政策检查集</title>
        <script src="/lib/axios.js"></script>
        <script src="/lib/vue.js"></script>
        <link rel="stylesheet" href="/lib/elementindex.css">
        <script src="/lib/elementindex.js"></script>
    </head>

    <body>
        <div id="app" style="width:100%">
            <el-tabs v-model='activeTab'>
                <el-tab-pane label="基本信息" name="rbasic">
                    <hc-rule-basic :ruledef='ruleDef'></hc-rule-basic>
                </el-tab-pane>
                <el-tab-pane label="分组检查策略" name="categoryconfig">
                    <el-table :data="categoryList" style="width: 100%;margin-bottom: 20px;" row-key="id" border
                        :default-sort="{prop: 'level', order: 'ascending'}">
                        <el-table-column label="分类码" sortable prop="code">
                        </el-table-column>
                        <el-table-column label="分类说明" prop="name">
                        </el-table-column>
                        <el-table-column label="优先级" sortable prop="level">
                        </el-table-column>
                        <el-table-column label="命中即停止后续检查" prop="hitToStop">
                            <template slot-scope="scope">
                                <el-checkbox v-model.trim="ruleDef.categoryHitToStop[scope.row.id]"></el-checkbox>
                            </template>
                        </el-table-column>
                    </el-table>
                </el-tab-pane>
                <el-tab-pane label="检查政策分组" name="ruleconfig">
                    <el-table :data="reasonList" style="width: 100%;margin-bottom: 20px;" row-key="id" border
                        :default-sort="{prop: 'code', order: 'ascending'}">
                        <el-table-column label="原因码" sortable prop="code">
                        </el-table-column>
                        <el-table-column label="分类说明" prop="name">
                        </el-table-column>
                        <el-table-column label="政策分组" sortable prop="categoryId">
                            <template slot-scope="scope">
                                <el-select v-model="ruleDef.reasonBelongsTo[scope.row.id]" placeholder="请选择" clearable
                                    filterable>
                                    </el-option>
                                    <el-option v-for="item in categoryList" :key="item.id" :label="item.code + ':' + item.name"
                                        :value="item.id">
                                    </el-option>
                                </el-select>
                            </template>
                        </el-table-column>
                    </el-table>
                </el-tab-pane>
                <!--                            <el-tab-pane label="合并配置" name="mergeconfig">
                                <el-form-item v-for="(item, index) in ruleDef.mergeSettings" :key="index">
                                    <el-input v-model="item.variable" placeholder="保持决策集结果变量">
                                        <template v-slot:prepend><span>{{'并入结果变量' + index}}</span></template>
                                        <template v-slot:append>
                                            <el-button @click.prevent="triggerDeleteVariable(index)">-</el-button>
                                        </template>
                                    </el-input>
                                </el-form-item>
                                <el-form-item>
                                    <el-button @click.prevent="triggerAppendVariable">增加</el-button></template>
                                    </el-input>
                                </el-form-item>
                            </el-tab-pane> -->
                <el-tab-pane label="规则测试" name="test">
                    <hc-test :rpath="ruleDef.rpath" :inputs='ruleDef.rtest' @save-inputs="ruleDef.rtest = $event"></hc-test>
                </el-tab-pane>
            </el-tabs>
            <el-form v-show="activeTab!=='test'" ref="form" label-width="auto">
                <el-form-item label="">
                    <el-button type="primary" @click='handleUpdateRuleEvent'>保存修改</el-button>
                    &nbsp;&nbsp;
                    <el-button type="danger" @click='handleDeleteRuleEvent'>删除规则</el-button>
                </el-form-item>
            </el-form>
        </div>

        <script src="/lib/ace-noconflict/ace.js"></script>
        <link rel="stylesheet" href="/com/hc-lang-editor.css" />
        <script type='module'>
            import * as $util from '/lib/hc-util.js'
            import * as $rest from '/lib/hc-rest-service.js'
            import {} from '/com/hc-test.js'
            import {} from '/com/hc-rule-basic-properties.js'

            var vm
            $rest.check$pinfoOrLoad(
                function() {
                    $rest.obtainRuleDefByRpath($util.getUrlArgOrDefault('rpath', 'xsxdjc/policy/Qszcj'), initvm);
                }, 'xsxdjc/Main');

            function initvm(ruleDef) {
                vm = new Vue({
                    el: '#app',
                    data: {
                        ruleDef: ruleDef,
                        categoryList:[],
                        reasonList: [],
                        activeTab:'categoryconfig',
                    },
                    methods: {
                        handleUpdateRuleEvent() {
                            $rest.updateRuleDefInVm(this)
                        },
                        handleDeleteRuleEvent() {
                            $rest.deleteRuleDefInVm(this)
                        },
                        triggerAppendVariable: function() {
                            this.ruleDef.mergeSettings.push({
                                variable: ""
                            });
                        },
                        triggerDeleteVariable: function(index) {
                            this.ruleDef.mergeSettings.splice(index, 1);
                        },
                    },
                });

                $rest.obtainRuleDefByRpath($pinfo.pcode() + '/PolicyCategory', function(ruleDef) {
                    vm.categoryList = ruleDef.list;
                });

                $rest.obtainRuleDefByRpath($pinfo.pcode() + '/PolicyReason', function(ruleDef) {
                    vm.reasonList = ruleDef.list;
                });
            };
        </script>

    </body>

</html>
